<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			.container {
				width: 400px;
				border: 1px solid;
				background: #ccc;
			}
			
			dt {
				font-size: 18px;
			}
			
			marquee {
				border: 1px solid;
			}
		</style>
	</head>

	<body>
		<div class="container">
			<dl>
				<dt><h1>behavior</h1></dt>
				<dd>
					<marquee behavior="alternate">我来回滚动</marquee>
					<marquee behavior="scroll">我单方向循环滚动</marquee>
					<marquee behavior="scroll" direction="up" height="30">我改单方向向上循环滚动</marquee>
					<marquee behavior="slide">我只滚动一次</marquee>
					<marquee behavior="slide" direction="up">我改向上只滚动一次了</marquee>
				</dd>
			</dl>

			<dl>
				<dt><h1>bgcolor</h1></dt>
				<dd>
					<marquee behavior=="slide" direction="left" bgcolor="#008000">我的背景色</marquee>
				</dd>
			</dl>
			<dl>
				<dt><h1>direction</h1></dt>
				<dd>
					<marquee direction="right">我向右滚动</marquee>
					<marquee direction="down">我向下滚动</marquee>
				</dd>
				<dt><h1>width和height</h1></dt>
				<dd>
					<marquee width="300" height="30" bgcolor="red">我宽300像素，高30像素。</marquee>
				</dd>
				<dt><h1>loop</h1></dt>
				<dd>
					<marquee loop="2">我滚动2次。</marquee>
					<marquee loop="infinite">我无限循环滚动。</marquee>
					<marquee loop="-1">我无限循环滚动。</marquee>

				</dd>
				<dt><h1>width和height</h1></dt>
				<dd>
					<marquee width="300" height="30" bgcolor="red">我宽300像素，高30像素。</marquee>
				</dd>
				<dt><h1>scrollamount和scrolldelay</h1></dt>
				<dd>
					<marquee scrollamount="30">我速度很快.</marquee>
					<marquee scrollamount="10">我慢了些。</marquee>
					<marquee scrolldelay="30" scrollamount="30">我小延时。</marquee>
					<marquee scrolldelay="1000" scrollamount="30">我大延时。</marquee>
				</dd>
				<dt><h1>align</h1></dt>
				<dd>
					<marquee scrollamount="10" align="left">我align left。</marquee>
				</dd>
				<dt><h1>参数</h1></dt>
				<dd>
					direction 表示滚动的方向，值可以是left，right，up，down，默认为left
				</dd>
				<dd>behavior 表示滚动的方式，值可以是scroll(连续滚动)slide(滑动一次)alternate(来回滚动)
				</dd>
				<dd>loop 表示循环的次数，值是正整数，默认为无限循环
				</dd>
				<dd>scrollamount 表示运动速度，值是正整数，默认为6
				</dd>
				<dd>scrolldelay 表示停顿时间，值是正整数，默认为0，单位是毫秒
				</dd>
				<dd>align 表示元素的垂直对齐方式，值可以是top，middle，bottom，默认为middle
				</dd>
				<dd>bgcolor 表示运动区域的背景色，值是16进制的RGB颜色，默认为白色
				</dd>
				<dd>height、width 表示运动区域的高度和宽度，值是正整数(单位是像素)或百分数，默认width=100% height为标签内元素的高度。
				</dd>
				<dd>hspace、vspace 表示元素到区域边界的水平距离和垂直距离，值是正整数，单位是像素。
				</dd>
				<dd>onmouseover=this.stop() onmouseout=this.start() 表示当鼠标以上区域的时候滚动停止，当鼠标移开的时候又继续滚动。</dd>
			</dl>
			<h1>实例</h1> 下面的例子使用了 MARQUEE 元素创建了由左向右的滚动字幕，移动速度为每 200 毫秒 10 像素。
			<MARQUEE DIRECTION=RIGHT BEHAVIOR=SCROLL SCROLLAMOUNT=10 SCROLLDELAY=200>这是一个滚动字幕。</MARQUEE>
			下面的例子显示了 marquee 元素的 scrollLeft 和 scrollTop 属性的一些用途。
			<MARQUEE id=m1 direction=right style="border-width:2px;border-style:solid;" width=200 height=200>向右</MARQUEE>
			 单击此按钮可在字幕滚动时读取 scrollLeft 和 scrollTop 属性的值。 
			<BUTTON onclick="alert('scrollLeft: ' + m1.scrollLeft + ' scrollRight: ' + m1.scrollTop)">读取</BUTTON>
			 当字幕停止时，你可以设置水平字幕的 scrollLeft，或者设置垂直字幕的 scrollTop。 
			<BUTTON onclick="m1.stop();m1.scrollLeft = 190;">停止并设置 scrollLeft=190</BUTTON>
			<BUTTON onclick="m1.start();">开始</BUTTON>
		</div>

	</body>

</html>